<template>
  <div class="column-container">
    <div class="name">{{ name }}</div>
    <div class="items">
      <item v-for="(it, index) in list" :key="index" :data="it"></item>
    </div>
  </div>
</template>
<script>
import item from './item';

export default {
  components: {
    item
  },
  props: {
    name: [String],
    list: [Array]
  },
  data() {
    return {
      data: {
        img: 'https://imgs.zuihuigou.shop/1559026286741',
        name: '哈哈',
        desc: '撒来得及的'
      }
    };
  }
};
</script>
<style lang="scss" scoped>
.column-container {
  background-color: #f2f6ff;
  display: flex;
  align-items: center;
  min-height: 50px;
  box-sizing: border-box;
  padding-left: 20px;
  margin-bottom: 8px;
  padding-top: 8px;
  //   padding-bottom: 8px;
  .name {
    color: #409eff;
    font-size: 16px;
    font-weight: bold;
    width: 100px;
  }
  .items {
    display: flex;
    flex-wrap: wrap;
    flex: 1;
  }
}
</style>
